<template>
  <Modal
    v-model="visibel"
    :title="`推荐人变更 ${editForm.nickName}`"
    @on-ok="ok"
    @on-cancel="cancel"
  >
    <Form
      :model="editForm"
      :label-width="80"
      :rules="ruleValidate"
      ref="formValidate"
    >
      <FormItem label="推荐人" prop="referrerId">
        <InputView v-model="editForm.referrerId" :label="editForm.referrerNickName" style="width: 200px" :berefereId="editForm.id" @select="handleDataSelect">
        </InputView>
      </FormItem>
    </Form>
  </Modal>
</template>

<script>
import * as API_Member from "@/api/member.js";
import InputView from '@/views/member/list/referrer-select-view/inputView.vue'

export default {
  components: {
    InputView
  },
  data() {
    return {
      visibel: false,
      editForm: {},
      ruleValidate: {
        referrerId: [{ required: true, message: "请选择推荐人!", trigger: "blur" }],
      },
    };
  },
  methods: {
    handleDataSelect(row) {
      this.$set(this.editForm, 'referrerId', row.id)
      this.$set(this.editForm, 'referrerMobile', row.mobile)
      this.$set(this.editForm, 'referrerNickName', row.nickName)
    },
    show(obj) {
      this.editForm = { ...obj };
      this.visibel = true;
    },
    cancel() {
      this.cancel = false;
    },
    ok() {
      this.$refs.formValidate.validate((valid) => {
        if (valid) {
          API_Member.updateMemberReferrer(this.editForm).then((res) => {
            if (res.code === 200) {
              this.$Message.success("修改成功！");
              this.$emit("reloadData");
            } else {
            }
          });
        } else {
        }
      });
    },
  },
};
</script>

<style></style>
